<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>11过滤器</title>
    <script src="https://cdn.bootcss.com/moment.js/2.24.0/moment.min.js"></script>
    <script src="https://cdn.bootcss.com/vue/2.6.10/vue.common.dev.js"></script>

</head>
<body>
    <div id="demo">
        <p>{{date}}}</p>
        <p>完整版：{{date | dateFormatter}}</p> <!--指定过滤器-->
        <p>日期：{{date | dateFormatter('YYYY-MM-DD')}}</p> <!--指定过滤器-->
        <p>时间：{{date | dateFormatter('HH:mm:ss')}}</p> <!--指定过滤器-->
    </div>
    <script>
        //自定义过滤器
        Vue.filter('dateFormatter', (value, pattern='YYYY-MM-DD HH:mm:ss')=>{
                return moment(value).format(pattern  );
        });
        new Vue({
            el: '#demo',
            data: {
                date: new Date()
            }
        });
    </script>
</body>
</html>